<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>取票人的信息 - 爽客网</title>
<%@include file="../common/js.jsp" %>
<%@include file="../common/css.jsp" %>
<link href="/css/base/hf.css" type="text/css" rel="stylesheet" />
<link href="/css/other.css" type="text/css" rel="stylesheet" />
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c" %>
</head>
<body>
					<h1>账户信息</h1>
 					<div class="ml20 mr20" >
                    	<ul class="i_title_sorts">
                        	<li>
                            	<a href="memberMain.htm">个人信息</a>
                            </li>
                            <li class="current">
                            	取票人信息
                            </li>
                        </ul>
                         <ul class="i_menu mt10">
                         </ul>
                         <!-- ticketer info -->
                        <div class="i_info_wrap">
                        	<div class="i_ticketer_wrap">
                            	<!-- left-->
                            	<div class="ticket_left" id="ticket_left">
                                	<!-- first ticketer-->
                                	<div class="ticketer_box">
                                    	<div class="pt10 pl15">
                                    		<h3><a href="javascript:void(0);" class="clrblue" onclick="updateMyT();">修改</a>亲自取票</h3>
                                            <ul class="t_info">
                                            	<li>姓名：<span>${member.username}</span></li>
                                                <li>手机：<span>${member.mobilephone }</span></li>
                                                <li>地址：<span>${member.address}</span></li>
                                                <li>邮编：<span>${member.zipcode}</span></li>
                                            </ul>
                                        </div>
                                        <form method="post" id="updateUser">
                                        <div class="t_update" style="display: none;" id="t_update">
                                        	<table>
                                            	<tr>
                                                	<td>姓名：</td>
                                                    <td><input type="hidden" class="t_input_txt" id="userId" value="${member.id}"/>
                                                    <input type="text" class="t_input_txt" id="userName" value="${member.username}"/></td>
                                                </tr>
                                                <tr>
                                                	<td>手机：</td>
                                                    <td><input type="text" class="t_input_txt" id="userPhone" value="${member.mobilephone }" disabled="disabled"/></td>
                                                </tr>
                                                <tr>
                                                	<td>地址：</td>
                                                    <td><input type="text" class="t_input_txt" id="userAddress" value="${member.address}"/></td>
                                                </tr>
                                                <tr>
                                                	<td>邮编：</td>
                                                    <td><input type="text" class="t_input_txt" id="userZipCode" value="${member.zipcode}"/></td>
                                                </tr>
                                                <tr>
                                                	<td></td>
                                                    <td><input type="submit" class="t_btn" value="保存提交" /></td>
                                                </tr>
                                            </table>
                                        </div>
                                        </form>
                                    </div>
                                    <!-- first ticketer--end-->
                                  <!-- other ticketer-->
                                 
                                 <c:forEach items="${tickerList}" var="ticker">
                                    <div class="ticketer_box t_otherinfo">
                                    	<div class="pt10 pl15">
                                    		<h3><span><a href="javascript:void(0);" class="clrblue" onclick="updateTInfo('${ticker.id}');">修改</a> | <a href="#" class="clrblue" onclick="deleteTicker('${ticker.id}')">删除</a></span>其他取票</h3>
                                            <ul class="t_info">
                                            	<li>姓名：<span>${ticker.name}</span></li>
                                                <li>手机：<span>${ticker.phone }</span></li>
                                                <li>地址：<span>${ticker.address }</span></li>
                                                <li>邮编：<span>${ticker.zipcode }</span></li>
                                            </ul>
                                        </div>
                                        <div class="t_update" style="display: none;" id="t_t_update_${ticker.id}"> 
                                        <table>
                                            	<tr>
                                                	<td>姓名：</td>
                                                    <td>
                                                    	<input type="text" class="t_input_txt" id="updateName_${ticker.id}" value="${ticker.name}"/>
                                                    </td>
                                                </tr>
                                                <tr>
                                                	<td>手机：</td>
                                                    <td><input type="text" class="t_input_txt" id="updatePhone_${ticker.id}" value="${ticker.phone }" /></td>
                                                </tr>
                                                <tr>
                                                	<td>地址：</td>
                                                    <td><input type="text" class="t_input_txt" id="updateAddress_${ticker.id}" value="${ticker.address }"/></td>
                                                </tr>
                                                <tr>
                                                	<td>邮编：</td>
                                                    <td><input type="text" class="t_input_txt" id="updateZipCode_${ticker.id}" value="${ticker.zipcode }"/></td>
                                                </tr>
                                                <tr>
                                                	<td></td>
                                                    <td><input type="button" class="t_btn" value="保存提交" onclick="updateTicker('${ticker.id}')"/></td>
                                                </tr>
                                            </table>
                                        </div>
                                    </div>
                                  </c:forEach>
                       <!-- other ticketer--end-->
                                </div>
                                <!-- left--end-->
                                
                                <!-- right-->
                                <div class="ticket_right">
                                	<div class="t_instruc">
                                    	<p>
                                        	<span class="clrblack block">取票人说明：</span>
                                            取票人信息将用于您前往景区取票时进行身份验证。如果您是为他人订购门票，新增填写游玩者本人的联系信息。
                                        </p>
                                        <a href="javascript:void(0);" onclick="addTicker();">新增取票人</a>
                                        <form method="post" id="newPerson">
	                                        <div class="ticketer_box" style="display: none;" id="addTickerDiv">
	                                            <div class="t_update">
	                                                <table>
	                                                    <tr>
	                                                        <td>姓名：</td>
	                                                        <td><input type="text" class="t_input_txt" id="newName"/></td>
	                                                    </tr>
	                                                    <tr>
	                                                        <td>手机：</td>
	                                                        <td><input type="text" class="t_input_txt" id="newPhone"/></td>
	                                                    </tr>
	                                                    <tr>
	                                                        <td>地址：</td>
	                                                        <td><input type="text" class="t_input_txt" id="newAddress"/></td>
	                                                    </tr>
	                                                    <tr>
	                                                        <td>邮编：</td>
	                                                        <td><input type="text" class="t_input_txt" id="newZipCode"/></td>
	                                                    </tr>
	                                                    <tr>
	                                                        <td></td>
	                                                        <td><input type="submit" class="t_btn" value="新增" /></td>
	                                                    </tr>
	                                                </table>
	                                            </div>
	                                    	</div>
                                    	</form>
                                    </div>
                                    
                                </div>
                                <!-- right--end-->
                            </div>
                        </div>
                        <!-- ticketer info--end -->
                        </div>
                   
</body>
<script type="text/javascript">
$("#newPerson").validate(
		{
			rules : {
				newName : {
					required : true,
					maxlength : 20
				},
				newPhone : {
					required : true,
					maxlength : 11
				},
				newAddress:{
					required : true,
					maxlength : 60
				},
				newZipCode:{
					required : true,
					maxlength : 20
				}
			},
			messages : {
				
				newName : {
					required : "请填写取票人名字",
					maxlength : "请填写取票人名字"
				},
				newPhone : {
					required : "请填写取票人手机",
					maxlength : "请正确输取票人手机"
				},
				newAddress : {
					required : "请填写取票人地址",
					maxlength : "请正确输取票人地址"
				},
				newZipCode:{
					required : "请填写取票人邮编",
					maxlength : "请填写取票人邮编"
				}
			},
			submitHandler : function() {
				$.post("newPerson.htm", {
					name : $("#newName").val(),
					phone : $("#newPhone").val(),
					address : $("#newAddress").val(),
					zipcode : $("#newZipCode").val()
					}, function(data) {
						if (data == 'success') {
							//从新加载
							$('#ticket_left').load("tickerLeft.htm");
						} else{
							alert("添加失败");
						}
					});
			}
		});




$("#updateUser").validate(
		{
			rules : {
				userName : {
					required : true,
					maxlength : 20
				},
				userPhone : {
					required : true,
					maxlength : 11
				},
				userAddress:{
					required : true,
					maxlength : 60
				},
				userZipCode:{
					required : true,
					maxlength : 20
				}
			},
			messages : {
				
				userName : {
					required : "请填写取票人名字",
					maxlength : "请填写取票人名字"
				},
				userPhone : {
					required : "请填写取票人手机",
					maxlength : "请正确输取票人手机"
				},
				userAddress : {
					required : "请填写取票人地址",
					maxlength : "请正确输取票人地址"
				},
				userZipCode:{
					required : "请填写取票人邮编",
					maxlength : "请填写取票人邮编"
				}
			},
			submitHandler : function() {
				$.post("updateUser.htm", {
					id:$("#userId").val(),
					username : $("#userName").val(),
					address : $("#userAddress").val(),
					zipcode : $("#userZipCode").val()
					}, function(data) {
						if (data == 'success') {
							//从新加载
							$('#ticket_left').load("tickerLeft.htm");
						} else{
							alert("修改失败");
						}
					});
			}
		});




	function addTicker(){
		  
		   if ( document.getElementById('addTickerDiv').style.display=="none") {  //隐藏
			    document.getElementById('addTickerDiv').style.display = "";

	        } else {                       //显示
	        	 document.getElementById('addTickerDiv').style.display  = "none";
	  
	        } 
	}
	
	function updateMyT(){
		 if ( document.getElementById('t_update').style.display=="none") {  //隐藏
			    document.getElementById('t_update').style.display = "";

	        } else {                       //显示
	        	 document.getElementById('t_update').style.display  = "none";
	  
	        } 
		
	}
	function memberIn(){
		$("#mainDetail").load("memberMain.htm");
	}
    function updateTInfo(id){
    	 if ( document.getElementById('t_t_update_'+id).style.display=="none") {  //隐藏
			    document.getElementById('t_t_update_'+id).style.display = "";

	        } else {                       //显示
	        	 document.getElementById('t_t_update_'+id).style.display  = "none";
	  
	        } 
    }
    function updateTicker(id){
    	$.post("updatePerson.htm", {
			id:id,
			name : $("#updateName_"+id).val(),
			phone : $("#updatePhone_"+id).val(),
			address : $("#updateAddress_"+id).val(),
			zipcode : $("#updateZipCode_"+id).val()
			}, function(data) {
				if (data == 'success') {
					//从新加载
					$('#ticket_left').load("tickerLeft.htm");
				} else{
					alert("修改失败");
				}
			});
    }
    function deleteTicker(id){
    	$.post("deleteTicker.htm", {
			id:id
			}, function(data) {
				if (data == 'success') {
					//从新加载
					$('#ticket_left').load("tickerLeft.htm");
				} else{
					alert("修改失败");
				}
			});
    }
</script>
</html>